<template>
  <el-dialog draggable overflow :title="'加料'" v-model="visible" :width="1000" destroy-on-close @closed="$emit('closed')">
    <el-tabs type="border-card">
      <el-tab-pane ref="tab" label="基础信息">
        <el-form :model="form" :rules="rules" ref="dialogForm" label-width="70px" label-position="right">
          <el-row>

            <el-col :span="6">
              <el-form-item label="客户">
                <el-input v-model="form.company_name" readonly class="readonly" />
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="产品">
                <el-input v-model="form.material.name" readonly class="readonly" />
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="批号">
                <el-input v-model="form.lot_name" readonly class="readonly" />
              </el-form-item>
            </el-col>

            <el-col :span="6">
              <el-form-item label="缸号">
                <el-input v-model="form.dyelot" readonly class="readonly" />
              </el-form-item>
            </el-col>

            <el-col :span="6">
              <el-form-item label="色号">
                <el-input v-model="form.color.code" readonly class="readonly" />
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="色名">
                <el-input v-model="form.color.name" readonly class="readonly" />
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="净重">
                <el-input v-model="form.yarn_quantity" readonly class="readonly red" />
              </el-form-item>
            </el-col>

            <el-col :span="6">
              <el-form-item label="浴量">
                <el-input v-model="form.bath_qty" readonly class="readonly red" />
              </el-form-item>
            </el-col>

          </el-row>
          <sc-VxeTable ref="xGrid1" :gridEvts="gridEvents" :gridOps="gridOps" :data="form.details"
            :tablecode="'pro_pot_add_raw'">
          </sc-VxeTable>
        </el-form>
      </el-tab-pane>
    </el-tabs>

    <template #footer>
      <el-button @click="visible = false">取 消</el-button>
      <el-button type="primary" :loading="isSaveing" @click="submit()">保 存</el-button>
    </template>
  </el-dialog>
</template>

<script>

// import tool from '@/utils/tool';
import skAutoChoose from "@/components/skAutoChoose";
import XEUtils from "xe-utils";
export default {
  emits: ["success", "closed"],
  components: { skAutoChoose },
  data() {
    return {

      gridEvents: {
        afterAddRow(item) {
          delete item.id;
        }
      },
      gridOps: {
        height: 500,
        columns: [
          {
            field: "material.name",
            event: {
              select: ({ e, row }) => {
                row["material"] = e;
                row['procedure'] = e.procedure;
                row['uunit'] = e.uunit ?? {};
                row['ounit'] = e.ounit ?? {};
                row['uunit_id'] = e.uunit_id;
                row['ounit_id'] = e.ounit_id;
                this.calcAuxiliaryQuantity(row);
                this.calcAuxiliaryAmount(row)
                this.calcAuxiliaryNewQuantity(row);
                this.calcAuxiliaryNewPercent(row);
              },
            },
          },
          {
            field: "rate",
            event: {
              keyup: ({ row }) => {
                this.calcAuxiliaryQuantity(row);
                this.calcAuxiliaryAmount(row);
                this.calcAuxiliaryNewQuantity(row);
                this.calcAuxiliaryNewPercent(row);
              },
            },
          },
          {
            field: "quantity",
            event: {
              keyup: ({ row }) => {
                this.calcAuxiliaryRate(row);//计算助剂比例
                this.calcAuxiliaryAmount(row)//计算金额
                this.calcAuxiliaryNewQuantity(row);//计算新增数量
                this.calcAuxiliaryNewPercent(row);//计算比例
              },
            },
          },
          {
            field: "percent",
            event: {
              keyup: ({ row }) => {
                this.calcAuxiliaryNewQuantity(row);
              },
            },
          },
          {
            field: "new_quantity",
            event: {
              keyup: ({ row }) => {
                this.calcAuxiliaryNewPercent(row);
              },
            },
          },
        ],
      },
      form: {
        color: {},
        material: {},
        details: [],
      },

      rules: {},
      visible: false,
      isSaveing: false,
      // processArray: []
    };
  },

  methods: {
    calcAuxiliaryNewQuantity(item) {
      let new_quantity = item.quantity * item.percent / 10;
      item.new_rate = item.rate * item.percent / 10;

      item.ouunit_id = item.uunit_id;
      item.ouunit = item.ouunit ?? [];
      //换算成KG
      if (item.ouunit_id == 1) {
        new_quantity = new_quantity / 1000;
      }

      item.new_cost = parseFloat(XEUtils.toFixed(item.material.average_price * new_quantity, 2));
      // uunit_ 1g 2kg
      //根据用量设置单位
      if (new_quantity < 1) {
        item.ouunit_id = 1;
        item.ouunit.name = 'g';
        new_quantity = new_quantity * 1000;
      }
      else {
        item.ouunit_id = 2;
        item.ouunit.name = 'kg';
      }
      item.new_quantity = parseFloat(XEUtils.toFixed(new_quantity, 6));

      return item;
    },

    calcAuxiliaryNewPercent(item) {
      let new_quantity = item.new_quantity;
      item.ouunit_id = item.ouunit_id ?? item.uunit_id;
      item.ouunit = item.ouunit ?? [];
      item.ouunit.name = item.ouunit.name ?? item.uunit.name;
      //不是KG，换算成KG
      if (item.ouunit_id == 1) {
        new_quantity = item.new_quantity / 1000;
      }
      //计算金额
      item.new_cost = parseFloat(XEUtils.toFixed(item.material.average_price * new_quantity, 2));

      let quantity = item.quantity;
      if (item.uunit_id == 1) {
        quantity = item.quantity / 1000;
      }

      item.percent = new_quantity / quantity * 10;
      return item;
    },
    //计算金额
    calcAuxiliaryAmount(item) {
      item.cost = parseFloat(XEUtils.toFixed(item.material.average_price * item.quantity / (1999 - item.uunit_id * 999), 2));
      return item;
    },
    //计算比例
    calcAuxiliaryRate(item) {
      // uunit_ 1g 2kg
      let quantity = item.quantity;
      if (item.uunit_id == 1) {
        quantity = item.quantity / 1000;
      }

      if (item.ounit_id == 1) {
        //%*数量/100   =>KG
        item.rate = quantity * 100 / this.form.yarn_quantity;
      }
      else {
        //g/L*数量/1000  =>KG
        item.rate = quantity * 1000 / this.form.bath_qty;
      }
      return item;
    },
    //计算数量
    calcAuxiliaryQuantity(item) {
      if (item.ounit_id == 1) {
        //%*数量/100   =>KG
        item.quantity = this.form.yarn_quantity * item.rate / 100;
      }
      else {
        //g/L*数量/1000  =>KG
        item.quantity = this.form.bath_qty * item.rate / 1000;
      }
      item.cost = parseFloat(XEUtils.toFixed(item.material.average_price * item.quantity, 2));
      // uunit_ 1g 2kg
      //根据用量设置单位
      if (item.quantity < 1) {
        item.uunit_id = 1;
        item.uunit.name = 'g';
        item.quantity = item.quantity * 1000;
      }
      else {
        item.uunit_id = 2;
        item.uunit.name = 'kg';
      }
      item.quantity = parseFloat(XEUtils.toFixed(item.quantity, 6));

      return item;
    },
    //显示
    open() {
      this.visible = true;
      return this;
    },

    //表单提交方法
    submit() {
      this.$refs.dialogForm.validate(async (valid) => {
        if (valid) {
          this.isSaveing = true;
          this.form.process_id = this.process_id;
          var res = await this.$API.pro.rawSend.save.post(this.form);
          this.isSaveing = false;
          if (res.code == 200) {
            this.$emit("success", this.form);
            this.visible = false;
            this.$message.success("操作成功");
          }
        }
      });
    },
    async getItems(id) {
      var res = await this.$API.pro.pot.raw.get({ pro_pot_id: id });
      if (res.code == 200) {
        this.form.details = res.data.map((v) => {
          v.percent = v.new_quantity = v.new_cost = v.new_rate = 0;
          return v;
        });
      }
    },

    //表单注入数据
    setData(data) {

      this.form = data;
      this.getItems(data.id);
      return this;
    },
  },
};
</script>

<style></style>
